<template>
	<view class="page-content">
		<u-navbar autoBack title="编辑" bgColor="#D9EDD4" fixed placeholder safeAreaInsetTop>
			<view class="detele" slot="right">删除</view>
		</u-navbar>

		<view class="container">
			<view class="content-center">
				<u--form>
					<u-form-item label="姓名" prop="userName">
						<u-input v-model="userName" />
					</u-form-item>
					<u-form-item label="电话">
						<u-input v-model="userInfo.phone" disabled />
					</u-form-item>
					<u-form-item label="地址">
						<u-input v-model="userInfo.address" disabled/>
					</u-form-item>
				</u--form>
			</view>

			<view class="content-btm">
				<button class="publish-btn" @click="submit()">保存</button>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				// 用户信息
				userInfo:[],
				userName: '',
			}
		},
		mounted() {
			uni.request({
				url:"http://localhost:3000/user/getUsersById",
				data:{
					userId: uni.getStorageSync('userId')
				},
				success:(res)=>{
					if (res?.data?.code == 200) {
						this.userInfo = res?.data?.data;
						this.userName = this.userInfo.username;
					} 
				}
			})
		},
		methods: {
			submit() {
				uni.request({
					url: "http://localhost:3000/user/username",
					method: 'POST',
					data: {
						userId: uni.getStorageSync('userId'),
						username: this.userName,
					},
					success: (res) => {
						if (res?.data?.code == 200) {
							this.$u.toast(res?.data?.data?.message)
						} 
					},
					fail: (res) => {
						this.$u.toast(res?.data?.msg)
					}
				})
			}
		}
	}
</script>

<style scoped lang="scss">
	.page-content{
		.detele{
			
		}
		.container{
			.content-center{
				padding: $uni-spacing-col-base $uni-spacing-row-lg;
			}
			/deep/.u-form-item__body__right{
				background-color: #fff;
			}
			.content-btm{
				width: 100%;
				position: fixed;
				bottom: 31px;
				.publish-btn {
					width: 80%;
					color: $uni-bg-color-grey;
					background-color: $gs-btn;
					border-radius: 26px;
				}
			}
		}
		
	}
</style>